Component({
  options: { addGlobalClass: !0, multipleSlots: !0 },
  properties: {
    type: { type: String, value: "click" },
    items: { type: Array, value: [] },
    position: { type: String, value: "top" },
    tabHeight: { type: Number, value: -1 },
    current: { type: Number, value: 0 },
    animation: { type: Boolean, value: !0 },
    miniBar: { type: Boolean, value: !1 },
    sticky: { type: Boolean, value: !1 },
    offsetTop: { type: Number, value: 0 },
    scrollTop: { type: Number, value: 0 },
  },
  observers: {
    current(t) {
      this.setData({ selectedIndex: t });
    },
  },
  data: {
    status: 0,
    opacity: 0,
    selectedIndex: 0,
    selectedTitleWidth: 0,
    headerData: {},
    tabItemData: [],
    tabTitleData: [],
    tabScrollLeft: 0,
    tabScrollTop: 0,
    container: null,
    blurEffect: !1,
    activeLeft: 0,
  },
  lifetimes: {
    ready() {
      this.data.status = 1;
      const t = this.createSelectorQuery();
      this.data.sticky &&
        this.setData({ container: () => t.select(".mt-tab") }),
        t.select(".mt-tab__hd").boundingClientRect(),
        t.selectAll(".mt-tab__item").boundingClientRect(),
        t.selectAll(".mt-tab__item-text").boundingClientRect(),
        t.exec((t) => {
          this.setData(
            {
              headerData: t[0],
              contentHeight:
                "left" === this.data.position
                  ? this.data.tabHeight
                  : 0 < this.data.tabHeight
                  ? this.data.tabHeight - t[0].height
                  : -1,
              opacity: 1,
              tabItemData: t[1],
              tabTitleData: t[2],
            },
            () => {
              this.showMask(),
                this.handleTab({
                  currentTarget: {
                    dataset: { index: this.data.selectedIndex },
                  },
                });
            }
          );
        });
    },
  },
  methods: {
    handleTab(t) {
      var a = t.currentTarget;
      const e = Number(a.dataset.index);
      var a = t.currentTarget.offsetLeft || 0,
        t = t.currentTarget.offsetTop || 0,
        i = this.data.headerData.width,
        s = this.data.headerData.height,
        d = this.data.tabItemData[e] && this.data.tabItemData[e].width,
        h = this.data.tabItemData[e] && this.data.tabItemData[e].height;
      let l = this.data.tabTitleData[e]?.width;
      this.data.miniBar ? (l = this.data.tabTitleData[e]?.width / 2) : (l -= 4);
      var r = (this.data.tabItemData[e]?.width - l) / 2,
        r = this.data.tabItemData[e]?.left + r - this.data.headerData.left;
      this.setData(
        {
          selectedIndex: e,
          tabScrollLeft: a - (i - d) / 2,
          tabScrollTop: t - (s - h) / 2,
          selectedTitleWidth: l,
          activeLeft: r,
        },
        () => {
          this.showMask(), this.triggerEvent("change", { index: e });
        }
      );
    },
    handleSwiper(t) {
      var { current: t, source: a } = t.detail,
        e = this.data.tabItemData[t]?.left;
      "touch" === a &&
        this.handleTab({
          currentTarget: { dataset: { index: t }, offsetLeft: e },
        });
    },
    showMask() {
      if ("top" === this.data.position) {
        const i = this.data.headerData.width;
        var t = this.data.selectedIndex,
          e = this.data.items.length;
        let a = 0;
        this.data.tabItemData.forEach((t) => {
          a += t.width;
        }),
          a.toFixed() > i.toFixed() && t !== e - 1
            ? this.setData({ blurEffect: !0 })
            : this.setData({ blurEffect: !1 });
      }
    },
    setTabIndex(t) {
      var a;
      this.data.status
        ? ((a = this.data.tabItemData[t]?.left),
          this.handleTab({
            currentTarget: { dataset: { index: t }, offsetLeft: a },
          }))
        : this.setData({ selectedIndex: t });
    },
    getTabIndex() {
      return this.data.selectedIndex;
    },
   
  },
});
